<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="css/aui.css">
    <link rel="stylesheet" href="css/style.css">
    <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
    <script type="text/javascript" src="js/init.js"></script>
    <title>新闻中心</title>
    <style>
        .awardlist >a{
            background: white;
            padding: .2rem;
            display: block;
        }
        .awardlist >a >div{
            border-bottom: 1px dashed gray;
            display: flex;
        }
        .awardlist >a >div p{
            flex:1;
            padding-left: .1rem;
        }
        .awardlist >a >div p:nth-child(2n-1){
            border-right: 1px solid gray;
        }
        .awardlist >a:nth-child(2n){
            background: none;
        }
    </style>
</head>
<body>
<header>
    <div class="f1"></div>
    <div class="f8">新闻中心</div>
    <div class="f1"></div>
</header>
<section class="bg-gray">
    <div class="pad-3">

        <!--<div class="flex pad-t-b-3 flex-stretch">
            <input class="mar-l-5 f1 bg-white border-gray border-radius-1 pad-1-2 mar-r-2" type="search" placeholder="搜索">
            <ul class="col-3 bg-white border-gray border-radius-1 flex">
                <a href="javascript:location.reload()" class="f1 border-r-gray">
                    <img class="col-3 auto" src="img/icon1.png" alt="" >
                </a>
                <li class="f1">
                    <img class="col-5 auto" src="img/icon2.png" alt="" >
                </li>
            </ul>
        </div>-->
        <ul class="awardlist line-h-2 border-gray"  data-now="1" data-num="2">
            <!--<li class="border-b-gray">
                <div>
                    <p>序号</p>
                    <p>2019-07-22</p>
                </div>
                <div>
                    <p>标题</p>
                    <p>大胜广东队公司的</p>
                </div>
                <div>
                    <p>日期</p>
                    <p>2.11</p>
                </div>
            </li>
            <li class="border-b-gray">
                <div>
                    <p>序号</p>
                    <p>2019-07-22</p>
                </div>
                <div>
                    <p>标题</p>
                    <p>大胜广东队公司的</p>
                </div>
                <div>
                    <p>日期</p>
                    <p>2.11</p>
                </div>
            </li>-->

        </ul>
        <p id="more" class="center pad-3" ></p>
    </div>
</section>
<footer>
    <a href="index.html" class="f1">
        <img src="img/foot1.png" alt="">
        <p>主页</p>
    </a>
    <a href="zhongchou.html" class="f1">
        <img src="img/foot2.png" alt="">
        <p>众筹中心</p>
    </a>
    <a href="#" class="f1 active">
        <img src="img/foot3.png" alt="">
        <p>资讯</p>
    </a>
    <a href="my.html" class="f1">
        <img src="img/foot4.png" alt="">
        <p>个人</p>
    </a>
</footer>

<script>
    var data, page, pageall;
    new AjaxRequest({
        type: 'post',
        dataType: 'json',
        url: hostUrl + 'index/notice/noticelist',
        data: data,
        callback: res => {
            if(res.status == 1){
                page = res.data.data;
                pageall = res.data.last_page;
                var list = '';
                for(var i=0;i<page.length;i++){
                    list += '<a href="newsDetail.html?id='+page[i].id+'" class="border-b-gray"><div><p>序号</p><p>'+(page[i].id?page[i].id:'')+'</p></div><div><p>标题</p><p>'+(page[i].title?page[i].title:'')+'</p></div><div><p>日期</p><p>'+(page[i].creattime?page[i].creattime:'')+'</p></div></a>';

                }
                $(".awardlist").html(list);
            }
        }
    });
    
    var lock = true;
    // 下拉加载更多
    $(document).scroll(function () {
        pageall>1?$("#more").show():$("#more").hide();
        var now = $(".awardlist").attr('data-now');

        var nowtop = $(document).scrollTop() + $(window).height() - 100;
        var moretop = $("#more").position().top;

        if(nowtop > moretop){
            if(lock){
                lock = false;
                now ++;
                $(".awardlist").attr('data-now',now);
                var data;
                new AjaxRequest({
                    type: 'post',
                    dataType: 'json',
                    url: hostUrl + 'index/Mycenter/bonus_details?page='+now,
                    data: data,
                    callback: res => {
                        console.log(now);
                        if(res.status == 1){
                            var list = '';
                            var page = res.data.data;
                            if(now < pageall){
                                for(var i=0;i<page.length;i++){
                                    list += '<a href="newsDetail.html?id='+page[i].id+'" class="border-b-gray"><div><p>序号</p><p>'+(page[i].id?page[i].id:'')+'</p></div><div><p>标题</p><p>'+(page[i].title?page[i].title:'')+'</p></div><div><p>日期</p><p>'+(page[i].creattime?page[i].creattime:'')+'</p></div></a>';

                                }
                                $(".awardlist").html(list);
                                $("#more").text('加载更多...');
                                lock = true;

                            }else{
                                $("#more").text('没有更多数据...');
                                lock = false;
                            }


                        }else{
                            toast(res.msg);
                        }
                    }
                })
            }

        }

    })
</script>

</body>
</html>